import { defineStore } from "pinia";
import { computed, ref } from "vue";
import { getAuthMenuList as fetchAuthMenuList } from "@/api/user"; // 避免命名冲突
import { getFlatMenuList } from "@/utils";

export const useAuthStore = defineStore("auth", () => {
  const isLoaded = ref(false);
  // const authMenuList = ref<string[]>([]);
  // 菜单权限列表
  const authMenuList = ref<Menu.MenuOptions[]>([]);

  // 菜单权限列表 ==> 扁平化之后的一维数组菜单，主要用来添加动态路由
  const flatMenuListGet = computed(() => getFlatMenuList(authMenuList.value));

  async function getAuthMenuList(): Promise<void> {
    try {
      const { data } = await fetchAuthMenuList(); // 调用重命名后的 fetchAuthMenuList
      authMenuList.value = data;
      console.log("wwwwwww", data);
      //   isLoaded.value = true;
    } catch (error) {
      console.error("Failed to fetch auth menu list:", error);
    }
  }

  function clear() {
    isLoaded.value = false;
    authMenuList.value = [];
  }
  async function setLoaded() {
    isLoaded.value = true;
  }
  return {
    isLoaded,
    authMenuList, // 导出以便在组件中访问
    getAuthMenuList,
    clear,
    setLoaded,
    flatMenuListGet,
  };
});
